.errorNumber,
.warningNumber,
.successNumber {
  font-size: 14px;
  font-weight: 500;
  line-height: 32px;
}

.errorNumber,
.errorText {
  color: #f5222d;
}

.warningNumber,
.warningText {
  color: #fa8c16;
}

.successNumber,
.successText {
  color: #52c41a;
}

.errorButton,
.warningButton,
.successButton {
  width: 100%;
  height: 90px !important;
  color: inherit;
  font-size: inherit !important;
  padding: 4px 0 8px !important;
  border-radius: 12px !important;
}

.errorButton {
  background-color: rgba(245, 34, 45, 0.08);

  &:hover {
    background-color: rgba(245, 34, 45, 0.15) !important;
  }
}

.warningButton {
  background-color: rgba(250, 139, 22, 0.08);

  &:hover {
    background-color: rgba(250, 139, 22, 0.15) !important;
  }
}

.successButton {
  background-color: rgba(82, 196, 26, 0.08);

  &:hover {
    background-color: rgba(82, 196, 26, 0.15) !important;
  }
}

.errorText,
.warningText,
.successText {
  opacity: 0.75;
  font-size: 13px;
  padding-bottom: 6px;
  margin-top: -2px;
}

.container {
  height: 40px;
  display: flex;
  align-items: center;
  padding: 10px 20px 10px 5px;
  border-radius: 10px;
  margin: 10px 0 20px 0;

  .icon {
    margin: 0 5px 0 10px;
  }

  .description {
    margin-right: 5px;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #000000a6;
  }

  .data {
    font-size: 14px;
    font-weight: 500;
    line-height: 32px;
  }
}

.common {
  background: #f0f5ff;
}

.warning {
  background: #fff7e6;
}
